<?php
$address = $this->address;
$settings = $this->settings;
$backTranslation = $this->backTranslation;
?>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<link rel="stylesheet" type="text/css" href="<?php echo RM_Environment::getConnector()->getRootURL(); ?>RM/userdata/modules/PickupDropoff/css/locationlist.css">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">

    var address = '<?php echo $address;?>';

    var geocoder;
    var map;
    var latlng

    function initialize() {

        geocoder = new google.maps.Geocoder();

        var myOptions = {
            zoom: <?php echo $settings['zoomlevel'];?>,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.<?php echo trim($settings['maptype']);?>
        }
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        
        codeAddress();

    }

    function codeAddress() {
        if (geocoder) {
            geocoder.geocode( { 'address': address}, function(results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    map.setCenter(results[0].geometry.location);
                    var marker = new google.maps.Marker({
                        map: map,
                        position: results[0].geometry.location
                    });
                    document.getElementById('map_canvas').style.visibility = 'visible';
                } else {
                    document.getElementById('error').style.visibility = 'visible';
                    document.getElementById('error').innerHTML = "Google Maps cannot locate:<br />" + address + "<br /> not found";
                }
            });
        }
    }
</script>
</head>
<body onload="initialize()">
    <div id="map_canvas" style="position: relative;visibility: hidden; width: 700px; height: 400px;"><!-- map is rendered here --></div>
    <div id="error" style="position: absolute; top:100px;left: 20%;right: 20%;visibility: hidden;float: none;text-align: center; color: #d5d5d5;"><!-- errors rendered here --></div>
    <a href="javascript:history.go(-1)" target="_self"><div class="rm-module-pickupdropoff-map-back-button"><?php echo $backTranslation;?></div></a>
</body>
</html>